<template>
  <div class="child">
    <h3>子组件2</h3>
    <h4>接收子组件传递的参数： {{ toy }}</h4>
  </div>
</template>

<script setup lang="ts" name="Child">
//接收数据的组件中：绑定事件、同时在销毁前解绑事件
import emitter from "@/utils/emitter";
import {ref,onUnmounted} from 'vue'

let toy = ref('')
emitter.on("send-toy", (value) => {
  console.log('send-toy事件被触发', value)
  toy.value = value;
})

onUnmounted(()=>{
  // 解绑事件
  emitter.off('send-toy')
})


</script>

<style scoped>
.child {
  background-color: yellow;
  width: 200px;
  height: 200px;
}
</style>